import React, { Component } from 'react'
import TheButton from '@/components/TheButton'
import TheTable from '@/components/TheTable'
import { apiGetSheetList, apiGetActivityStaus } from '@/request/coupons'

export default class Access extends Component {
  state = {
    columns: [
      {
        title: '获取方式',
        dataIndex: 'activityName',
        key: 'activityName',
      },
      {
        title: '操作',
        render: (text, record) => {
          return <>
            <TheButton  haspermi={['coupons:access:state']} onClick={() => this.changeStatus(record)}>{record.activityStatus ? '开启' : '关闭'}</TheButton>
            <TheButton  haspermi={['coupons:access:detail']} onClick={() => this.props.history.push(`/coupons/access/list/${record.activityId}`)}>查看优惠券</TheButton>
          </>
        }
      }
    ],
    dataSource: [1],
    loading: false
  }
  componentDidMount() {
    this.getData()
  }
  getData = async () => {
    this.setState({
      loading: true
    })
    let res = await apiGetSheetList({activityType:'COUPONS'})
    if (res.data && res.code === 0) {
      this.setState({
        dataSource: res.data
      })
    }
    this.setState({
      loading: false
    })
  }
  changeStatus = value => {
    const { activityId, activityStatus } = value
    React.$confirm({
      title: `${activityStatus ? '开启' : '关闭'}此获取方式吗？`,
      onOk: async () => {
        let res = await apiGetActivityStaus({ activityId, status: activityStatus ? 0 : 1 })
        if (res.code === 0) {
          React.$message({
            type: 'info',
            content: `${activityStatus ? '开启' : '关闭'}成功`
          })
          this.getData()
        }
      }
    })
  }
  render() {
    const { columns, dataSource, loading } = this.state
    return (
      <div className="p-layout-box">
        <div className="p-layout-content">
          <TheTable columns={columns} dataSource={dataSource} loading={loading} />
        </div>
      </div>
    )
  }
}
